<!DOCTYPE <!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Table test</title>
</head>

<body>

    <p>创建没有边框的表格：</p>

    <p>表格 1 :</p>

    <table>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>

    <p>表格 2 :</p>

    <table border="0">
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>

    <p>创建带有边框、水平表头及标题的表格：</p>

    <table border="1">
        <caption>Mail ID</caption>
        <tr>
            <th>Name</th>
            <th>Mail ID</th>
        </tr>
        <tr>
            <td>Fichin</td>
            <td>fichin.lai@wpi-group.com</td>
        </tr>
        <tr>
            <td>Koga</td>
            <td>koga.liang@wpi-group.com</td>
        </tr>
    </table>

    <p>创建带有边框、垂直表头及标题的表格：</p>

    <table border="1">
        <caption>Mail ID</caption>
        <tr>
            <th>Name</th>
            <td>Fichin</td>
            <td>Koga</td>
        </tr>
        <tr>
            <th>Mail ID</th>
            <td>fichin.lai@wpi-group.com</td>
            <td>koga.liang@wpi-group.com</td>
        </tr>
    </table>

    <p>创建演示单元格间距和边距及表格的边框宽度：</p>

    <table border="10" cellpadding="10" cellspacing="10">
        <tr>
            <td>X</td>
            <td>X</td>
        </tr>
        <tr>
            <td>X</td>
            <td>X</td>
        </tr>
    </table>

    <p>创建跨行或列含标签的表格：</p>

    <table border="1">
        <caption>跨行和跨列含标签的表格</caption>
        <tr>
            <th>Table</th>
            <th colspan="2">X</th>
        </tr>
        <tr>
            <th rowspan="2">Y</th>
            <td>
                <p>表格内包含一个表格：</p>
                <table border="1">
                    <tr>
                        <td>Z</td>
                        <td>Z</td>
                    </tr>
                    <tr>
                        <td>Z</td>
                        <td>Z</td>
                    </tr>
                </table>
            </td>
            <td>
                <h1>表格内含大标题</h1>
            </td>
        </tr>
        <tr>
            <td>
                <p>表格内含列表：</p>
                <ul>
                    <li>one</li>
                    <li>two</li>
                    <li>three</li>
                </ul>
            </td>
            <td>
                <p>表格内含图片</p>
                <img src="save.gif" alt="save" width="500" height="255">
            </td>
        </tr>
    </table>

    <p>完整的表格：</p>

    <table border="1">
        <thead>
            <tr>
                <th>ADD</th>
                <th>X</th>
                <th>Y</th>
                <th>Z</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>one</td>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
            <tr>
                <td>two</td>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
            <tr>
                <td>three</td>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
        </tbody>
        <tfoot>
            <th>total</th>
            <td>3</td>
            <td>6</td>
            <td>9</td>
        </tfoot>
    </table>
</body>

</html>